<template>
    <a-modal v-model:visible="visible" @ok="handleOk" @cancel="handleCancel">
    <template #title>
      图标
    </template>
    <div class="iconList">
      <div class="iconItem" v-for="v,i in iconList" :key="i">
        <img :src="v.url" alt="">
        <span>{{ v.name }}</span>
      </div>
    </div>
  </a-modal>
</template>

<script setup>
import { getListReq } from "@/api/icon/index";
import { onMounted, ref } from "vue";

const iconList = ref([])

onMounted(() => {
  getListReq().then(res => {
    iconList.value = res.data
  })
})

</script>

<style lang="scss" scoped>
.iconList{
  display: flex;
  align-items: center;
  .iconItem{
    margin-bottom: 24px;
  }

}
</style>